<template>
    <div>
        <el-breadcrumb separator="/" class="m-b-20">
            <el-breadcrumb-item><a href="/">后台首页</a></el-breadcrumb-item>
            <el-breadcrumb-item>会员管理</el-breadcrumb-item>
        </el-breadcrumb>
        <el-table :data="tableData" class="m-t-15">
            <!-- <el-table-column type="selection" width="55"></el-table-column>
            <el-table-column prop="id" label="会员ID" width="150" class="t-c"></el-table-column>
            <el-table-column prop="content" label="内容" width="700"></el-table-column>
            <el-table-column prop="time" :formatter="dateFormat" label="提交时间" width="200"></el-table-column>
            <el-table-column label="操作" min-width="200">
                <template #default="v">
                    <el-button size="mini" type="danger" @click="handleDelete(v.$index, v.row)">删除</el-button>
                </template>
            </el-table-column> -->
            <el-table-column type="selection" width="55"></el-table-column>
            <el-table-column prop="id" label="ID" width="100" class="t-c"></el-table-column>
            <el-table-column label="头像" width="150" class="t-c">
                <template #default="v">
                    <img class="avatar" :src="v.row.avatar">
                </template>
            </el-table-column>
            <el-table-column prop="username" label="账号/手机" width="200"></el-table-column>
            <el-table-column label="昵称" width="200">
                <template #default="v">
                    {{v.row.nickname}}
                </template>
            </el-table-column>
            <el-table-column prop="time" :formatter="dateFormat" label="注册时间" width="200"></el-table-column>
            <el-table-column label="" min-width="200"></el-table-column>
        </el-table>
        <el-pagination background hide-on-single-page layout="prev, pager, next" :total="total" :current-page="current"
            @current-change="changePage">
        </el-pagination>
    </div>
</template>

<script>
    import {
        get
    } from "@/network/request"
    import moment from 'moment'
    export default {
        name: 'User',
        data() {
            return {
                tableData: [],
                total: 0,
                current: 1
            }
        },
        mounted() {
            this.$nextTick(() => {
                get('/userList', {
                    page: this.current
                }).then(res => {
                    const result = res.data
                    if (result.code == 200) {
                        this.tableData = result.data.data
                        this.total = result.data.total
                        this.current = result.data.current
                    }
                }).catch()
            })
        },
        methods: {
            dateFormat(row, column, time) {
                return moment.unix(time).format("YYYY-MM-DD HH:mm:ss")
            },
            changePage(page) {
                get('/userList', {
                    page
                }).then(res => {
                    const result = res.data
                    if (result.code == 200) {
                        this.tableData = result.data.data
                        this.total = result.data.total
                        this.current = result.data.current
                    }
                }).catch()
            }
        },
    }
</script>

<style scoped>
</style>